<template>
  <div>
    <h1>子组件</h1>
    <button @click="emitMsg">向父组件通信</button>
    <slot></slot>
  </div>
</template>

<script>
export default {
  props: {
    msg: {
      type: String,
      required: true
    }
  },
  setup (props, context) {
   /* 
    setup 参数
      参数1  props 
      参数2 context 上下文
        attrs 保存 透传过来所有的属性
        emit 触发自定义 事件方法 
        expose 暴露公共方法
        slots 插槽内容

   */
    console.log(props.msg);
    console.log(context);

    const emitMsg = () => {
      context.emit('biubiu', '子组件携带的数据')
    }
    return {
      emitMsg
    }
  }
}
</script>

<style lang="scss" scoped>

</style>